<template>
  <glsx-dialog :show="showPopup" :title="getTitle()" @close="closeDialog()" v-if="showPopup">
    <div class="">
      <el-form ref="addForm" :model="addForm" :rules="addFormRules" label-width="100px" size="small">
        <el-form-item label="名称：" prop="name">
          <el-input v-model="addForm.name"></el-input>
        </el-form-item>
        <el-form-item label="icon：">
          <ImageUpload v-model="addForm.icon" size="small"></ImageUpload>
        </el-form-item>
        <el-form-item label="是否上架：" prop="onShelf">
          <el-radio-group v-model="addForm.onShelf">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="2">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="排序时间：" prop="orderTime">
          <el-date-picker v-model="addForm.orderTime" type="date" class="a_input" placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker>
        </el-form-item>
      </el-form>
    </div>
    <div slot="footer">
      <el-button type="primary" size="small" :loading="loading" @click="saveInfo">确定</el-button>
      <el-button type="default" size="small" @click="closeDialog()">取消</el-button>
    </div>
  </glsx-dialog>
</template>
<script>
import { deepClone, showToast } from "@/common/util";
import {
  ADD_HOSPITALCLASS_INFO,
  EDIT_HOSPITALCLASS_INFO,
  GET_HOSPITALCLASS_INFO,
  ADD_DOCTORTITLE_INFO,
  EDIT_DOCTORTITLE_INFO,
  GET_DOCTORTITLE_INFO,
  ADD_PROJECT_INFO,
  EDIT_PROJECT_INFO,
  GET_PROJECT_INFO,
  ADD_TROUBLE_INFO,
  EDIT_TROUBLE_INFO,
  GET_TROUBLE_INFO,
  ADD_FEATUREDSERVICES_INFO,
  EDIT_FEATUREDSERVICES_INFO,
  GET_FEATUREDSERVICES_INFO,
  ADD_FEATUREDLABEL_INFO,
  EDIT_FEATUREDLABEL_INFO,
  GET_FEATUREDLABEL_INFO,
  ADD_ARTICLECLASS_INFO,
  EDIT_ARTICLECLASS_INFO,
  GET_ARTICLECLASS_INFO,
} from "@/http/configuration";
import ImageUpload from '@/components/upload/upload.vue'
export default {
  name: "AddPopup",
  props: {
    value: {
      type: Boolean,
      default: false,
    },
    id: {
      type: [String, Number],
      default: "",
    },
    type: {
      type: String,
      default: "",
    },
  },
  components:{
    ImageUpload
  },
  watch: {
    value: {
      handler: function (n) {
        this.showPopup = n;
      },
      immediate: true,
    },
    id: {
      handler: function (n) {
        if (n) {
          this.getInfo(n);
        }
      },
      immediate: true,
    },
  },
  data() {
    return {
      showPopup: false,
      addForm: {},
      addFormRules: {
        name: [{ required: true, message: "请输入名称", trigger: "blur" }],
        onShelf: [
          { required: true, message: "请选择是否上架", trigger: "change" },
        ],
        orderTime: [
          { required: true, message: "请选择排序时间", trigger: "change" },
        ],
      },
      loading: false,
      nameList: {
        hospital: "className",
        doctor: "titleName",
        project: "projectName",
        trouble: "troubleName",
        service: "serviceName",
        label: "labelName",
        articleclass: "className",
      },
    };
  },
  methods: {
    // 关闭弹框
    closeDialog() {
      this.$emit("input", false);
      this.addForm = {};
    },

    // 动态获取标题
    getTitle() {
      let titleList = {
        hospital: "医院类型",
        doctor: "医生职称",
        project: "口腔项目",
        trouble: "口腔问题",
        service: "特色服务",
        label: "特色标签",
        articleclass: "文章分类",
      };
      let title = this.id ? "编辑" : "新增";
      title += titleList[this.type];
      return title;
    },

    // 获取详情
    getInfo(id) {
      let _this = this;
      let callBack = this.getDetailCallBack();
      let oParams = {};
      oParams.id = id;
      callBack(oParams).then((res) => {
        let obj = res.data || {};
        let o = {};
        let nameList = _this.nameList;
        o.name = obj[nameList[_this.type]];
        o.id = obj.id;
        o.onShelf = obj.onShelf;
        o.orderTime = obj.orderTime;
        if(obj.icon){
          o.icon = obj.icon.split(',')
        }

        _this.addForm = o;
      });
    },

    // 参数处理
    getParams() {
      let o = deepClone(this.addForm);
      let nameList = this.nameList;
      let id = nameList[this.type];
      o[id] = o.name;

      if(o.icon){
        o.icon = o.icon.toString()
      }

      delete o.name;
      return o;
    },

    // 动态设置新增请求接口
    getAddCallBack() {
      let addCallBack = {
        hospital: ADD_HOSPITALCLASS_INFO,
        doctor: ADD_DOCTORTITLE_INFO,
        project: ADD_PROJECT_INFO,
        trouble: ADD_TROUBLE_INFO,
        service: ADD_FEATUREDSERVICES_INFO,
        label: ADD_FEATUREDLABEL_INFO,
        articleclass: ADD_ARTICLECLASS_INFO,
      };
      let callBack = addCallBack[this.type];
      return callBack;
    },

    // 动态设置编辑请求接口
    getEditCallBack() {
      let addCallBack = {
        hospital: EDIT_HOSPITALCLASS_INFO,
        doctor: EDIT_DOCTORTITLE_INFO,
        project: EDIT_PROJECT_INFO,
        trouble: EDIT_TROUBLE_INFO,
        service: EDIT_FEATUREDSERVICES_INFO,
        label: EDIT_FEATUREDLABEL_INFO,
        articleclass: EDIT_ARTICLECLASS_INFO,
      };
      let callBack = addCallBack[this.type];
      return callBack;
    },

    // 动态设置详情请求接口
    getDetailCallBack() {
      let addCallBack = {
        hospital: GET_HOSPITALCLASS_INFO,
        doctor: GET_DOCTORTITLE_INFO,
        project: GET_PROJECT_INFO,
        trouble: GET_TROUBLE_INFO,
        service: GET_FEATUREDSERVICES_INFO,
        label: GET_FEATUREDLABEL_INFO,
        articleclass: GET_ARTICLECLASS_INFO,
      };
      let callBack = addCallBack[this.type];
      return callBack;
    },

    // 保存数据
    saveInfo() {
      let _this = this;
      _this.$refs.addForm.validate((valid) => {
        if (!valid) {
          return false;
        }
        let oParams = _this.getParams();
        let callBack = _this.getAddCallBack();
        let msg = "新增成功";

        // 编辑
        if (_this.id) {
          oParams.id = _this.id;
          callBack = _this.getEditCallBack();
          msg = "编辑成功";
        }

        callBack(oParams).then((res) => {
          if (res.code == 200) {
            showToast({
              message: msg,
              type: "success",
            });
            _this.closeDialog();
            _this.$emit("change");
          }
        });
      });
    },
  },
};
</script>
<style lang="scss" scoped>
</style>